<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=no">
    <title>日新网_我的资料</title>
    <link rel="stylesheet" href="__TMPL__Public/assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="__TMPL__Public/assets/css/reset.css">
    <link rel="stylesheet" href="__TMPL__Public/assets/css/style.css">
    <script type="text/javascript" src="__TMPL__Public/assets/js/rem.js"></script>
    <link rel="stylesheet" type="text/css" href="__TMPL__Public/assets/clickphoto/clickphoto.css">
    <script src="__TMPL__Public/assets/clickphoto/jquery.min.js"></script>
    <script src="__TMPL__Public/assets/clickphoto/iscroll-zoom.js" type="text/javascript" charset="utf-8"></script>
    <script src="__TMPL__Public/assets/clickphoto/lrz.all.bundle.js" type="text/javascript" charset="utf-8"></script>
    <script src="__TMPL__Public/assets/clickphoto/hammer.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="__TMPL__Public/assets/clickphoto/jquery.photoClip.min.js" type="text/javascript"
            charset="utf-8"></script>
    <style>
        .tab_nav li {
            width: 100% !important;
            text-align: center;
        }
        .tab_nav {
            margin-top: .4rem !important;
        }
        #ok {
            width: 4rem;
            height: .8rem;
            background-color: #000232;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 5px;
            color: #FFFFFF;
            font-size: .3rem;
            letter-spacing: .1rem;
            margin-left: 1.72rem;
        }
        lable {
            font-size: .20rem !important;
        }
        .radio {
            font-size: 14px;
            margin-top: 4px !important;
        }
        .radio label {
            line-height: 1;
        }
        .radio_self {
            height: 32px;
            line-height: .32rem;
            background-color: #FFFFFF;
            border: 1px solid #c5c5c5;
            border-radius: 5px;
            margin-top: .05rem;

        }
        .form-control[disabled] {
            background-color: #fff !important;
        }
        input[type='radio'] {
            position: relative !important;
            top: 2px !important;
        }
        input[type="text"] {
            display: inline-block;
        }
        .group_sm {
            width: 60%;
        }
        @media screen and (max-width: 640px) {
            .group_sm2 {
                width: 100% !important;
            }
        }
        /*上传图片样式 开始*/
        #view {
            width: 2rem;
            height: 2rem;
        }
        .clipContent {
            width: 1.4rem;
            height: .32rem;
            line-height: .32rem;
            margin: .1rem auto 0;
            position: relative;
            left: -.1rem;
        }
        #clipArea {
            max-height: 500px;
        }
        .pf_col_div {
            /*margin-bottom: .4rem;*/
        }
        /*上传图片样式 结束*/
    </style>
</head>
<body>
<!--nav-->
<tc_include file="Public:nav"/>
<!--专栏认证-->
<div class="tab_nav " id="tab_nav">
    <ul class="comWidth clearfix">
        <li class="active">行家认证</li>
    </ul>
</div>
<div id="tab_content">
    <div class="basics comWidth">
        <p class="column_title">完善个人信息</p>

        <!--头像-->
        <div class="column_pic">
            <div>
                <div class="tabs">
                    <div class="tab-content clearfix">
                        <div class="clipRow2" style="" ontouchstart="">
                            <div class="cover-wrap">
                                <div class="clipBgn">
                                    <div id="clipArea">
                                        <div class="photo-clip-view">
                                            <div class="photo-clip-moveLayer">
                                                <div class="photo-clip-rotateLayer">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="photo-clip-mask">
                                            <div class="photo-clip-mask-left"></div>
                                            <div class="photo-clip-mask-right"></div>
                                            <div class="photo-clip-mask-top"></div>
                                            <div class="photo-clip-mask-bottom"></div>
                                            <div class="photo-clip-area"></div>
                                        </div>
                                    </div>
                                    <div class="clipButton" style="position: relative;">
                                        <button id="clipBtn">保存图片</button></div>
                                </div>
                            </div>
                            <div id="view"></div>
                            <div class="clipContent" style="">上传图片<input type="file" id="file" accept="image/*">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!--基本信息-->
        <form id="base_form" method="post" action="{:u('user/profile/edit_post')}">
            <div class="form-group group_sm">
                <label for="user_nicename">名字</label>
                <input type="text" class="form-control" id="user_nicename" name="user_nicename" value="{$user_nicename}" placeholder="名字">
            </div>
            <div class="form-group group_sm">
                <p style="color: #333;font-weight: bolder;">婚否</p>
                <div class="radio_self">
                    <div class="radio radio-inline">
                        <label>
                            <input type="radio" name="marry" value="1" {$marry== 1 ? 'checked' : ''}>已婚
                        </label>
                    </div>
                    <div class="radio radio-inline">
                        <label>
                            <input type="radio" name="marry" value="0" {$marry== 0 ? 'checked' : ''}>未婚
                        </label>
                    </div>
                </div>
            </div>
            <div class="form-group group_sm group_sm2">
                <label for="birthday">生日</label>
                <input type="date" class="form-control" id="birthday" name="birthday" value="{$birthday}" placeholder="出生年月">
            </div>
            <div class="form-group">
                <label for="position">职位</label>
                <input type="text" class="form-control" id="position" name="position" value="{$position}" placeholder="职位">
            </div>
            <div class="form-group">
                <label for="areaInfo">常驻城市</label>
                <div id="areaInfo">
                    <input name="city_id" hidden>
                </div>
            </div>
            <div class="form-group">
                <label for="company">公司</label>
                <input type="text" class="form-control" id="company" name="company" value="{$company}" placeholder="公司">
            </div>
            <div class="form-group">
                <label for="signature">简单介绍</label>
                <textarea class="form-control" rows="3" id="signature" name="signature">{$signature}</textarea>
            </div>
            <button type="submit" class="btn btn-default container basics_btn" id="ok">完成</button>
        </form>
    </div>


    <!--专栏作者信息-->
    <div class="column_info comWidth">
        <p class="column_title">完善行家认证信息</p>
        <form id="professor_form" method="post" action="{:U('professor/professor/professor_edit')}">

            <!--详细介绍-->
            <div class="column_introduce">
                <p style="margin-bottom: .22rem;">详情介绍 <a href="javascript:;"><span></span></a></p>
                <textarea class="form-control" name="introduction">{$professor_info.introduction}</textarea>
            </div>
            <!--企业信息-->
          
            <div class="column_item">
                <p class="title">企业信息<a href="{:U('User/Profile/save_user_company_info')}"><span class="edit_icon"></span></a></p>
                <div class="pf_col_div">
                    <p class="name"><a href="javascript:;">{$company}&nbsp;&gt;</a></p>
                    <p class="major"><a id="company_link_a" href="javascript:;" style="color: #000232;text-decoration: underline;">{$company_link}</a> ></p>
                    <p class="major">{$company_start_time} 成立</p>
                    <p class="major">{$company_addr}</p>
                    <p class="major">{$scale}</p>
                    <p class="content" style="line-height: .32rem;">{$company_introduction}</p>
                </div>
            </div>
            <!--项目经历-->
            <div class="column_item">
                <p class="title">项目经历 <a href="{:U('professor/professor/pf_project_edit')}"><span></span></a></p>
                <volist name="pf_project" id="vo">
                    <div class="pf_col_div">
                        <p class="name"><a href="{:U('professor/professor/pf_project_edit', ['id' => $vo['id']])}">{$vo.project_name}&nbsp;&gt;</a></p>
                        <p class="time"><span>{$vo.start_time}</span>—<span>{$vo.end_time|default='至今'}</span></p>
                        <p class="content">{$vo.project_desc}</p>
                    </div>
                </volist>
            </div>
           
            <!--教育经历-->
            <div class="column_item">
                <p class="title">教育经历 <a href="{:U('professor/professor/pf_education_edit')}"><span></span></a></p>
                <volist name="pf_education" id="vo">
                    <div class="pf_col_div">
                        <p class="name"><a href="{:U('professor/professor/pf_education_edit', ['id' => $vo['id']])}">{$vo.school}&nbsp;&gt;</a></p>
                        <p class="major"><span>{$vo.major}</span><span>{$vo.degree}</span></p>
                        <p class="time"><span>{$vo.start_time}</span>—<span>{$vo.end_time|default='至今'}</span></p>
                        <p class="content">{$vo.experience}</p>
                    </div>
                </volist>
            </div>


            <!--出版作品-->
            <div class="column_item">
                <p class="title">出版作品 <a href="{:U('professor/professor/pf_publish_edit')}"><span></span></a></p>
                <volist name="pf_publish" id="vo">
                    <div class="pf_col_div">
                        <p class="name"><a href="{:U('professor/professor/pf_publish_edit', ['id' => $vo['id']])}">{$vo.article_name}&nbsp;&gt;</a></p>
                        <p class="time">{$vo.magazine}</p>
                        <p class="major"><span>{$vo.publish_time}</span><span>{$vo.publish_house}</span></p>
                    </div>
                </volist>
            </div>


            <!--资格认证-->
            <div class="column_item">
                <p class="title">资格认证 <a href="{:U('professor/professor/pf_certificate_edit')}"><span></span></a></p>
                <volist name="pf_certificate" id="vo">
                    <div class="pf_col_div">
                        <p class="name"><a href="{:U('professor/professor/pf_certificate_edit', ['id' => $vo['id']])}">{$vo.certificate_name}&nbsp;&gt;</a></p>
                        <p class="time"><span>{$vo.start_time}</span>—<span>{$vo.end_time}</span></p>
                        <p class="major">{$vo.certificate_no}</p>
                        <p class="major">{$vo.certification}</p>
                    </div>
                </volist>
            </div>


            <!--专利发明-->
            <div class="column_item">
                <p class="title">专利发明 <a href="{:U('professor/professor/pf_patent_edit')}"><span></span></a></p>
                <volist name="pf_patent" id="vo">
                    <div class="pf_col_div">
                        <p class="name"><a href="{:U('professor/professor/pf_patent_edit', ['id' => $vo['id']])}">{$vo.patent_name}&nbsp;&gt;</a></p>
                        <p class="major">{$vo.patent_country}</p>
                        <p class="major">{$vo.patent_no}</p>
                    </div>
                </volist>
            </div>


            <!--荣誉奖项-->
            <div class="column_item">
                <p class="title">荣誉奖项 <a href="{:U('professor/professor/pf_award_edit')}"><span></span></a></p>
                <volist name="pf_award" id="vo">
                    <div class="pf_col_div">
                        <p class="name"><a href="{:U('professor/professor/pf_award_edit', ['id' => $vo['id']])}">{$vo.award_name}&nbsp;&gt;</a></p>
                        <p class="time">{$vo.award_time}</p>
                        <p class="major">{$vo.award_organization}</p>
                        <p class="time">{$vo.award_desc}</p>
                    </div>
                </volist>
            </div>

            <!--form表单提交-->
            <button class="column_btn">完成</button>
        </form>
    </div>
</div>

<!--页脚-->
<tc_include file="Public:footer"/>
<script type="text/javascript" src="__TMPL__Public/assets/js/jquery.1.12.4.js"></script>
<script src="__TMPL__Public/assets/js/bootstrap.min.js"></script>
<script src="__PUBLIC__/js/layer/layer_1.js"></script>
<script src="__PUBLIC__/js/area.js"></script>

<script>
    $('#company_link_a').click(function () {
        var href = $(this).text();
        if (href.indexOf('http') < 0) {
            href = 'http://' + href;
        }
        window.location.href = href;
    });
</script>

<!--城市下拉菜单，三级联动-->
<script>
    var area = {$area};
    area = eval(area);

    var areaPath = {$path ? $path : []};
    areaPath = eval(areaPath);

    $(function () {
        // 地址选择select的初始化
        initArea(2);
    });
</script>

<!--原头像加载-->
<script>
    $(function () {
        var old_avatar = "{:sp_get_user_avatar_url($avatar)}?t={:time()}";
        if (old_avatar) {
            $('#view').css('background-image', 'url(' + old_avatar + ')');
        }
    })
</script>

<script type="text/javascript">
    //上传封面
    var clipArea = new bjj.PhotoClip("#clipArea", {
        size: [200, 200],// 截取框的宽和高组成的数组。默认值为[260,260]
        outputSize: [0, 0], // 输出图像的宽和高组成的数组。默认值为[0,0]，表示输出图像原始大小
        //outputType: "jpg", // 指定输出图片的类型，可选 "jpg" 和 "png" 两种种类型，默认为 "jpg"
        file: "#file", // 上传图片的<input type="file">控件的选择器或者DOM对象
        view: "#view", // 显示截取后图像的容器的选择器或者DOM对象
        ok: "#clipBtn", // 确认截图按钮的选择器或者DOM对象
        loadStart: function (fileObj) {
            // 开始加载的回调函数。this指向 fileReader 对象，并将正在加载的 file 对象作为参数传入
            $('.cover-wrap').fadeIn();
            console.log("照片读取中");
        },
        loadComplete: function () {
            // 加载完成的回调函数。this指向图片对象，并将图片地址作为参数传入
            console.log("照片读取完成");
        },
        //loadError: function(event) {}, // 加载失败的回调函数。this指向 fileReader 对象，并将错误事件的 event 对象作为参数传入
        clipFinish: function (dataURL) {
            // 裁剪完成的回调函数。this指向图片对象，会将裁剪出的图像数据DataURL作为参数传入
            $('.cover-wrap').fadeOut();
            $('#view').css('background-size', '100% 100%');
            // console.log(dataURL); //输出图像base64

            $.post("{:U('User/Profile/save_user_avatar')}", {data_url: dataURL}, function (re) {
                if (re.status) {
                    $('.headicon').attr('src', re.data);
                } else {
                    layer.msg(re.info);
                }
            })
        }
    });
</script>
</body>
</html>